<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <!-- 引入 layui.css -->
    <link href="//unpkg.com/layui@2.8.0/dist/css/layui.css" rel="stylesheet">
    <!-- 引入 layui.js -->
    <script src="//unpkg.com/layui@2.8.0/dist/layui.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <style>
        #search {
            position: sticky;
            top: 30px;
            right: 310px;
            z-index: 9999;
            margin-top: 35px;
            margin-left: 1150px;
            margin-bottom: -30px;
        }
        .layui-form-item{
            margin-top: -5px;
            margin-left: 100px;
        }


    </style>
</head>
<body>
<button type="button" id="search" name="search" class="layui-btn" onclick="AdvancedSearch()">搜索</button>
<form class="layui-form" action="form.html">
    <div class="layui-form-item">
        <div class="layui-inline">
            <div class="layui-inline">
                <label class="layui-form-label">设计师搜索:</label>
                <div class="layui-input-inline">
                    <input type="text" name="staffName" lay-verify="required" placeholder="按照 关键词 搜索"
                           autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">订单编号:</label>
                <div class="layui-input-inline layui-input-wrap">
                    <input type="text" name="styleNumber" lay-verify="required" placeholder="按照 订单编号 搜索"
                           autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">订单状态:</label>
                <div class="layui-input-inline">
                    <select name="auditStatus" lay-verify="required" lay-search>
                        <option value="-1">所有</option>
                        <option value="0">未提交审核</option>
                        <option value="1">已审核提交</option>
                        <option value="2">申请成功</option>
                        <option value="3">申请失败</option>
                    </select>
                </div>
            </div>
        </div>
        <%--<div class="layui-collapse">--%>
            <%--<div class="layui-colla-item">--%>
                <%--<div class="layui-colla-title">--%>
                    <%--<lable>收起搜索</lable>--%>
                <%--</div>--%>
                <%--<div class="layui-colla-content">--%>
                    <%--<div class="layui-form-item">--%>
                        <%--<label class="layui-form-label">客户名称:</label>--%>
                        <%--<div class="layui-input-inline">--%>
                            <%--<input type="text" name="clientName" lay-verify="required" placeholder="按照 客户名称 搜索"--%>
                                   <%--autocomplete="off" class="layui-input">--%>
                        <%--</div>--%>
                        <%--<label class="layui-form-label">款号:</label>--%>
                        <%--<div class="layui-input-inline">--%>
                            <%--<input type="text" name="styleNumber" lay-verify="required" placeholder="按照 款号 搜索"--%>
                                   <%--autocomplete="off" class="layui-input">--%>
                        <%--</div>--%>
                        <%--<label class="layui-form-label">销售员:</label>--%>
                        <%--<div class="layui-input-inline">--%>
                            <%--<input type="text" name="staffName" lay-verify="required" placeholder="按照 销售员 搜索"--%>
                                   <%--autocomplete="off" class="layui-input">--%>
                        <%--</div>--%>
                    <%--</div>--%>
                    <%--<div class="layui-form-item">--%>
                        <%--<label class="layui-form-label">备注:</label>--%>
                        <%--<div class="layui-input-block">--%>
                            <%--<input type="text" name="remark" lay-verify="required" placeholder="按照 备注 搜索"--%>
                                   <%--autocomplete="off"--%>
                                   <%--class="layui-input">--%>
                        <%--</div>--%>
                    <%--</div>--%>
                    <%--<div class="layui-form-item">--%>
                        <%--<label class="layui-form-label">交易日期:</label>--%>
                        <%--<div class="layui-input-inline">--%>
                            <%--<input type="text" autocomplete="off" class="layui-input" placeholder="开始日期">--%>
                        <%--</div>--%>
                        <%--<div class="layui-form-mid">-</div>--%>
                        <%--<div class="layui-input-inline">--%>
                            <%--<input type="text" autocomplete="off" class="layui-input" placeholder="结束日期">--%>
                        <%--</div>--%>
                        <%--<div class="layui-inline">--%>
                            <%--<label class="layui-form-label">数量:</label>--%>
                            <%--<div class="layui-input-inline">--%>
                                <%--<input type="text" autocomplete="off" class="layui-input" placeholder="大于此数">--%>
                            <%--</div>--%>
                            <%--<div class="layui-form-mid">-</div>--%>
                            <%--<div class="layui-input-inline">--%>
                                <%--<input type="text" autocomplete="off" class="layui-input" placeholder="小于此数">--%>
                            <%--</div>--%>
                        <%--</div>--%>
                    <%--</div>--%>
                    <%--<div class="layui-form-item">--%>
                        <%--<div class="layui-inline">--%>
                            <%--<label class="layui-form-label">金额:</label>--%>
                            <%--<div class="layui-input-inline">--%>
                                <%--<input type="text" autocomplete="off" class="layui-input" placeholder="大于此数">--%>
                            <%--</div>--%>
                            <%--<div class="layui-form-mid">-</div>--%>
                            <%--<div class="layui-input-inline">--%>
                                <%--<input type="text" autocomplete="off" class="layui-input" placeholder="小于此数">--%>
                            <%--</div>--%>
                        <%--</div>--%>
                    <%--</div>--%>
                    <%--<div class="center-div layui-anim layui-anim-upbit">--%>
                        <%--<div class="layui-input-block">--%>
                            <%--<button class="layui-btn" lay-submit lay-filter="searchForm">高级搜索</button>--%>
                            <%--<button type="button" class="layui-btn layui-btn-warm">重置</button>--%>
                        <%--</div>--%>
                    <%--</div>--%>
                <%--</div>--%>
            <%--</div>--%>
        <%--</div>--%>
    </div>
    </div>
</form>

<table id="demo" lay-filter="test"></table>
</body>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script type="text/javascript">

    layui.use(function () {
        var element = layui.element;
        var layer = layui.layer;
        // 折叠面板点击事件
        element.on('collapse(filter-collapse)', function (data) {
            console.log(data.show); // 得到当前面板的展开状态，true or false
            console.log(data.title); // 得到当前点击面板的标题区域对象
            console.log(data.content); // 得到当前点击面板的内容区域对象

            // 显示状态，仅用于演示
            layer.msg('展开状态：' + data.show);
        });
    });
    layui.use('table', function () {
        var table = layui.table;
        // 创建渲染实例
        table.render({
            elem: '#demo'
            ,height: 600
            ,url: 'SampleSheet/queryAllSampleSheetList' //数据接口
            ,page: true //开启分页
            ,limit:4
            ,limits:[4,8,12]
            ,toolbar: '#toolbarDemo'
            , cols: [[
                {field: 'sampleSheetNum', title: '样板单编号'}
                , {field: 'clientName', title: '客户'}
                , {field: 'styleNumber', title: '款号'}
                , {field: 'styleName', title: '款式名称'}
                ,{field: 'auditStatusStr', title: '审核状态',width: 100}
                , {field: 'designNumber', title: '设计号',width: 180}
                , {field: 'staffName', title: '设计师',width: 80}
                , {field: 'styleUnit', title: '款式单位',width: 90}
                , {field: 'patternDate', title: '打板时间',width: 110}
                , {field: 'finishedPlateDate', title: '完版时间',width: 110}
                ,{fixed: 'right',title: '操作', width: 280, align: 'center',
                    templet: function (d) {
                        // alert(d.auditStatus )
                        if (d.auditStatus == "0") {
                            return '\n' +
                                '<button type="button" class="layui-btn layui-btn-primary layui-btn-sm "  lay-event="toRedact" style="background-color: #16b777; color: white">编辑</button>' +
                                '<button type="button" lay-event="toDetail" class="layui-btn layui-btn-primary layui-btn-sm " style="background-color: #1e9fff; color: white" >详情</button>' +
                                '<button type="button" class="layui-btn layui-btn-primary layui-btn-sm " lay-event="toSubmit" lay-on="alert" style="background-color: #ff5722; color: white">提交</button>'
                        } else if (d.auditStatus == "1") {
                            return '\n' +
                                ' <button type="button" class="layui-btn layui-btn-primary layui-btn-sm layui-btn-disabled "  lay-event="toRedact" style="background-color: #16b777; color: white">编辑</button>' +
                                '<button type="button" lay-event="toDetail" class="layui-btn layui-btn-primary layui-btn-sm " style="background-color: #1e9fff; color: white" >详情</button>'+
                                '        <button class="layui-btn layui-btn-danger layui-btn-sm layui-btn-disabled" id="barDemo">已提交审核</button>\n' +
                                '   ';
                        }else if (d.auditStatus == "2") {
                            return '\n' +
                                '<button type="button" class="layui-btn layui-btn-primary layui-btn-sm layui-btn-disabled" style="background-color: #16b777; color: white">编辑</button>' +
                                '<button type="button" lay-event="toDetail" class="layui-btn layui-btn-primary layui-btn-sm " style="background-color: #1e9fff; color: white" >详情</button>' +
                                '        <button class="layui-btn layui-btn-warm layui-btn-sm " style="background-color:#1aa094" id="barDemo">审核通过</button>\n' +
                                '   ';
                        }else if (d.auditStatus == "3") {
                            return '\n' +
                                '<button type="button" class="layui-btn layui-btn-primary layui-btn-sm "  lay-event="toRedact" style="background-color: #16b777; color: white">编辑</button>' +
                                '<button type="button" lay-event="toDetail" class="layui-btn layui-btn-primary layui-btn-sm " style="background-color: #1e9fff; color: white" >详情</button>' +
                                '        <button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="toSubmit" id="barDemo">重新提交</button>\n' +
                                '   ';
                        }
                    }}
            ]]
        })
    })

</script>

<script type="text/html" id="templet-demo-theads-tool2">
    <div class="layui-btn-group">
        <button type="button" class="layui-btn layui-btn-primary layui-btn-sm "  lay-event="toRedact" style="background-color: #16b777; color: white">编辑</button>
        <button type="button" lay-event="toDetail"  class="layui-btn layui-btn-primary layui-btn-sm " style="background-color: #1e9fff; color: white" >详情</button>
        <button type="button" class="layui-btn layui-btn-primary layui-btn-sm " lay-event="toSubmit" lay-on="alert" style="background-color: #ff5722; color: white">提交</button>
    </div>
</script>

<script type="text/javascript">
/*    function toDetailss() {//跳详情页面
        window.location.href="toSampleSheetDetail";
    }*/

    layui.use(['table', 'form', 'laydate'], function() {
        var table = layui.table;
        // Event listener for the table tool
        table.on('tool(test)', function(obj){
            if(obj.event == 'toSubmit'){
                $.ajax({
                    url: 'SampleSheet/changeSubmit',
                    type: 'post',
                    data:{"sampleSheetId":obj.data.sampleSheetId},
                    dataType: 'text',
                    success: function(result) {
                        console.log(obj.data.sampleSheetId)
                        if (result === "success") {
                            layer.alert('提交成功！');
                            table.reload('demo')
                        }else {
                            layer.alert('提交失败或已经提交！');
                        }
                    },
                    error:function () {
                        layer.alert('网络正忙！');
                    }
                });
            } else if(obj.event === 'toRedact'){//去编辑页
                let sampleSheetId=obj.data.sampleSheetId;
                let styleNumberId=obj.data.styleNumberId;
                  window.location.href="toRedactSampleSheet?sampleSheetId="+sampleSheetId+"&styleNumberId="+styleNumberId;
            }else if (obj.event === 'toDetail'){//去详情页
                let sampleSheetId=obj.data.sampleSheetId;
                let styleNumberId=obj.data.styleNumberId;
                window.location.href="toSampleSheetDetail?sampleSheetId="+sampleSheetId+"&styleNumberId="+styleNumberId;
            }
        });
    });
    function AdvancedSearch() {
        let staffName = $('[name=staffName]').val();
        let styleNumber= $('[name=styleNumber]').val();
        let auditStatus = $('[name=auditStatus]').val();
        // let orderMoneyMax = $('[name=orderMoneyMax]').val();
        // let startTime = $('[name=startTime]').val();
        // let endTime = $('[name=endTime]').val();
        // 检查是否至少填写了一个字段

        var requestData = {
            staffName: staffName,
            styleNumber: styleNumber,
            auditStatus: auditStatus,
            // orderMoneyMax: orderMoneyMax,
            // startTime:startTime,
            // endTime:endTime
        }
        $.ajax({
            url: 'SampleSheet/getSheetListView',
            type: 'post',
            data: requestData,
            dataType: 'json',
            success: function (result) {
                layui.use('table', function () {
                    var table = layui.table;
                    // 创建渲染实例
                    table.render({
                        elem: '#demo',
                        data: result,
                        cols: [[
                            {field: 'sampleSheetNum', title: '样板单编号'}
                            , {field: 'clientName', title: '客户'}
                            , {field: 'styleNumber', title: '款号'}
                            , {field: 'styleName', title: '款式名称'}
                            , {field: 'auditStatusStr', title: '审核状态',}
                            , {field: 'designNumber', title: '设计号'}
                            , {field: 'staffName', title: '设计师'}
                            , {field: 'styleUnit', title: '款式单位'}
                            , {field: 'patternDate', title: '打板时间'}
                            , {field: 'finishedPlateDate', title: '完版时间'}
                            , {
                                fixed: 'right',
                                title: '操作',
                                width: 150,
                                align: 'center',
                                toolbar: '#templet-demo-theads-tool'
                            }
                        ]]
                    })
                });
            }
        });
    }
</script>
</body>
</html>
